<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link rel="icon" href="img/favicon.ico" type="imgae/x-icon">
    <link rel="stylesheet" href="css/allBasic.css">
    <link rel="stylesheet" href="css/shop.css">
    <title>我的购物车</title>
</head>
<body>
<div class="shop_wrap page_box" >
    <!--<div class="site_toper">-->
        <!--<div class="m_pbw clearfix">-->
            <!--<a href="" class="l">返回系统</a>-->
            <!--<nav class="shop_nav l">-->
                <!--<a href="goods.html" >产品中心</a>-->
                <!--<a href="cart.html">购物车</a>-->
                <!--<a href="order.html">订单列表</a>-->
                <!--<a href="">收货地址</a>-->
            <!--</nav>-->
        <!--</div>-->
    <!--</div>-->
    <!--<header class="shop_hed clearfix">-->
        <!--<div class="m_pbw">-->
            <!--<img src="img/logo-x.png" class="logo">-->
            <!--<h1 class="lg_t">购物车</h1>-->
        <!--</div>-->
    <!--</header>-->
    <div class="page_box_head title_color3">
        <span class="page_title_sign"><i class="iconfont">&#xe6c1;</i></span>
        <h3 class="page_title">我的购物车</h3>
    </div>
    <div class="cart_area m_pbw">
        <table class="tb_crt">
            <thead class="">
            <tr class="tb_crt_title">
                <td  class="td_chk"><input type="checkbox" class="chk all_choose">全选</td>
                <td class="td_item" colspan="2">商品信息</td>
                <td class="td_sm">单价</td>
                <td class="td_sm">数量</td>
                <td class="td_sm">金额</td>
                <td class="td_sm">操作</td>
            </tr>
            <tr><td class="td_br_sm"></td></tr>
            </thead>
            <tbody>
               <tr class="crt_list cart_row">
                <td class="td_chk">
                    <input type="checkbox" class="chk choice">
                </td>
                <td class="td_item">
                    <a href="" title="" class="td_item_m">
                        <img src="img/cp.jpg" class="item_pic l">
                        <div class="item_info l">
                            帽子女秋冬天韩版毛线帽韩国狐狸毛球帽休闲百搭简约儿童针织帽潮
                        </div>
                    </a>
                </td>
                <td class="td_info">
                    尺码：成人版【单层加厚】
                    颜色分类：酒红帽+酒红狐狸毛球
                </td>
                <td class="td_price">
                    <del>￥888</del>
                    <em>￥<i class="price">10</i></em>
                </td>
                <td class="td_num">
                    <div class="buy_num">
                        <button type="button" class="reduce btn">-</button>
                        <input type="text" class="num" value="1">
                        <button type="button" class="add btn">+</button>
                    </div>
                </td>
                <td class="td_total">
                    <em>￥<span class="total">0</span></em>
                </td>
                <td class="td_op">
                    <a title="移除购物车" class="delete">移除购物车</a>
                </td>
            </tr>
               <tr class="crt_list cart_row">
                <td class="td_chk">
                    <input type="checkbox" class="chk choice">
                </td>
                <td class="td_item">
                    <a href="" title="" class="td_item_m">
                        <img src="img/cp.jpg" class="item_pic l">
                        <div class="item_info l">
                            帽子女秋冬天韩版毛线帽韩国狐狸毛球帽休闲百搭简约儿童针织帽潮
                        </div>
                    </a>
                </td>
                <td class="td_info">
                    尺码：成人版【单层加厚】
                    颜色分类：酒红帽+酒红狐狸毛球
                </td>
                <td class="td_price">
                    <del>￥888</del>
                    <em>￥<i class="price">10</i></em>
                </td>
                <td class="td_num">
                    <div class="buy_num">
                        <button type="button" class="reduce btn">-</button>
                        <input type="text" class="num" value="1">
                        <button type="button" class="add btn">+</button>
                    </div>
                </td>
                <td class="td_total">
                    <em>￥<span class="total">0</span></em>
                </td>
                <td class="td_op">
                    <a title="移除购物车" class="delete">移除购物车</a>
                </td>
            </tr>
               <tr class="crt_list cart_row">
                <td class="td_chk">
                    <input type="checkbox" class="chk choice">
                </td>
                <td class="td_item">
                    <a href="" title="" class="td_item_m">
                        <img src="img/cp.jpg" class="item_pic l">
                        <div class="item_info l">
                            帽子女秋冬天韩版毛线帽韩国狐狸毛球帽休闲百搭简约儿童针织帽潮
                        </div>
                    </a>
                </td>
                <td class="td_info">
                    尺码：成人版【单层加厚】
                    颜色分类：酒红帽+酒红狐狸毛球
                </td>
                <td class="td_price">
                    <del>￥888</del>
                    <em>￥<i class="price">10</i></em>
                </td>
                <td class="td_num">
                    <div class="buy_num">
                        <button type="button" class="reduce btn">-</button>
                        <input type="text" class="num" value="1">
                        <button type="button" class="add btn">+</button>
                    </div>
                </td>
                <td class="td_total">
                    <em>￥<span class="total">0</span></em>
                </td>
                <td class="td_op">
                    <a title="移除购物车" class="delete">移除购物车</a>
                </td>
            </tr>
            </tbody>
        </table>
        <div class="js_wrap" id="cart_js">
            <!--<div class="js_area fix" >-->
                <a href="" class="js_item">结算</a>
            <!--</div>-->
        </div>
    </div>
</div>
</body>
<script src="js/jquery-3.1.1.min.js"></script>
<script src="./lib/layui/layui.js"></script>
<script src="js/cart.js"></script>
<script>
    layui.use(['layer','laypage','form'], function(){
        var laypage = layui.laypage,
            layer = layui.layer,
            form=layui.form;
        form.render();
        deleteRowDt(".delete");
    });
    function deleteRowDt(btn){
        $(btn).click(function(){
            top.layer.confirm('确定移除购物车吗？',{
                btn: ['确定','消息'] //按钮
            });
        });
    }
    $().ready(function(){
        changeNum(".buy_num");
        priceSum(".cart_row");
//        isViewInner("#cart_js");
    });
    function isViewInner(obj){
        var wh=$(window).height(),
            scrollTop=0,
            h=$(obj).offset().top+$(obj).outerHeight(),
            op={
             add:function(){
                 $(obj).addClass("fix");
             },
            remove:function(){
                $(obj).removeClass("fix");
            }
            };
        console.log(wh);
        if(h>wh){
            op.add();
        }else{
           op.remove();
        }
        $(window).scroll(function(){
            scrollTop=$(window).scrollTop();
            if(h>=wh && h<(wh+scrollTop)){
                op.remove();
            }else{
                op.add();
            }
        });
    }
</script>
</html>